<template>
<div>
     <Modal v-model="modal" :title="title" :styles="{width:'400px'}">
        <Form ref='modifyForm' :model="obj" label-position="right" :rules="ruleValidate" :label-width="100" >
            <FormItem label="快递公司" prop="expressCompany">
                <Select v-model="obj.expressCompany" style="width:200px">
                   
                    <OptionGroup label="常用" >
                        <Option v-for="items in up" :value="items.expressCode" :key="items.guid+'_'">{{ items.expressCompany }}</Option>
                    </OptionGroup>

                    <OptionGroup :label="k" v-for="(val,k) in express" :key="k">
                        <Option v-for="item in val" :value="item.expressCode" 
                        :key="item.guid+'u'">{{ item.expressCompany }}</Option>
                    </OptionGroup>
                </Select>
            </FormItem>
            <FormItem label="快递单号" prop="expressNumber">
                <Input  v-model="obj.expressNumber" style="width:200px;"></Input>
            </FormItem>
            <FormItem label="快递时间" prop="expressTime">
                <DatePicker type="date" @on-change="(r)=>{obj.expressTime=r}"  style="width: 200px" v-model="date" ></DatePicker>
            </FormItem>
         </Form>
        
         <div slot="footer">
             <Button @click="cancel()">关闭</Button>
             <Button type="primary" @click="submit('addForm')" >确认发送</Button>
         </div>
     </Modal>
</div>
</template>
<script>
 export default {
     data (){
         return {
             modal:false,title:'快递邮寄',date:'',
             express:{},up:[],
             obj:{expressCompany:'',expressNumber:'',expressTime:''},
             ruleValidate:{
                 expressNumber:[
                     { required: true, message: '快递单号不能为空', trigger: 'blur' }
                 ],expressCompany:[
                     {required:true,message:'请选择快递公司',trigger:'change'}
                 ],expressTime:[
                    {required:true,message:'请选择时间',trigger:'change'}
                 ]
             }
         }
     },methods:{
         showdata(params){
           
            var a=Object.assign({},this.$store.state.global.express);
            this.up=a.useful;
            a.useful=null;
            this.express=a;

            this.modal=true;
            this.obj.guid=params;
            this.obj.expressCompany='';
            this.obj.expressNumber='';
            this.$refs.modifyForm.resetFields();
         },
         submit(){
            //console.log(this.handleSubmit())
            //return;
             if(this.handleSubmit()){
                
                 var url='/invoice/output/update';
                
                 this.axios.post(url,this.obj).then((res)=>{
                     if(res.errorCode==0){
                        this.modal=false;
                         this.obj={};
                         this.date='';
                         this.$Message.success('成功');
                         this.$emit('refresh');
                     }
                 })   
                 //成功
                 
             }
         },
         cancel(){
             this.modal=false;
         },handleSubmit () {
             var a=true;
             this.$refs['modifyForm'].validate((valid) => {
                 if (valid) {
                     //this.$Message.success('Success!');
                 } else {
                     //this.$Message.error('Fail!');
                     a=false;
                 }
             })
             return a;
         },
     },created(){
         this.$bus.on('bus_expressedit', this.showdata);
         
     },beforeDestroy(){
         this.$bus.off('bus_expressedit',this.showdata)
     }
 }
</script>
